import React from 'react';
import { inject, observer } from 'mobx-react';
import { Modal, message, Button, Spin } from "antd";
import { WeaLocaleProvider, WeaTop, WeaRightMenu, WeaTab, WeaAlertPage} from 'ecCom';
import { WeaTableNew } from "comsMobx";
import {Condition, getAdButtons} from '../list/listCondition';
import {ReportInfoDialog} from '../dialog/ReportInfoDialog';
import {InfoTag} from '../util/infoTag';

import {Text} from '../util/text';
const text = new Text();
const WeaTable = WeaTableNew.WeaTable;
const getLabel = WeaLocaleProvider.getLabel;

@inject("infoReportListStore")
@observer
class InfoReportList extends React.Component {

    constructor(props) {
        super(props);
        this.state = {
        }
    }

    //截取路由最后的字符串
    // getUrlChar = (char) => {
    //     let index = char.lastIndexOf('/')+1;
    //     return char.substr(index)
    // }


    componentDidMount() {
        const {infoReportListStore} = this.props;
        // const getType = this.getUrlChar(location.pathname);
        // const params = {'type':getType}
        const {params} = this.props;       //根据url中的type类型判断list类型，如待报信息，已报信息,上报审批等  waitReport,successReport,auditReport
        //  const {type} = this.props.location.query;   
        infoReportListStore.tabs = [];
        infoReportListStore.loadingSpin = true;
        infoReportListStore.getInfoReportList(params);
    }

    componentWillReceiveProps(nextProps) {
        const {infoReportListStore} = this.props;
        if (this.props.location.key !== nextProps.location.key) {
            const {params} = nextProps;
            infoReportListStore.tabs = [];
            infoReportListStore.loadingSpin = true;
            infoReportListStore.getInfoReportList(params);
        }
    }

    getTopButtons = () => {
        const {infoReportListStore} = this.props;
        let btns = [];
        btns.push(
            infoReportListStore.getTopButton()
        )
        return btns;
    }

    reRenderColumns(columns) {
        columns.forEach(c => {
            if (c.dataIndex == 'status') {
                c.render = (text, record, index) => {
                    let valueSpan = record[c.dataIndex + "span"];
                    if (record[c.dataIndex] == '0') {        //待报
                        return <InfoTag ecId={`${this && this.props && this.props.ecId || ''}_InfoTag@8vkcik`} color='#2db7f5' name={valueSpan}></InfoTag>
                    } else if (record[c.dataIndex] == '1') {      //审批中
                        return <InfoTag ecId={`${this && this.props && this.props.ecId || ''}_InfoTag@8uy1wm`} color='#ff9000' name={valueSpan}></InfoTag>
                    } else if (record[c.dataIndex] == '2') {      //驳回
                        return <InfoTag ecId={`${this && this.props && this.props.ecId || ''}_InfoTag@qb6enz`} color='#dd3131' name={valueSpan}></InfoTag>
                    } else if (record[c.dataIndex] == '3') {      //审批通过
                        return <InfoTag ecId={`${this && this.props && this.props.ecId || ''}_InfoTag@89qwz2`} color='#87d068' name={valueSpan}></InfoTag>
                    } else if (record[c.dataIndex] == '4') {      //已采用
                        return <InfoTag ecId={`${this && this.props && this.props.ecId || ''}_InfoTag@mi9vvj`} color='#bf8f8f' name={valueSpan}></InfoTag>
                    } else if (record[c.dataIndex] == '5') {      //已发布
                        return <InfoTag ecId={`${this && this.props && this.props.ecId || ''}_InfoTag@lta8bt`} color='#45cfe7' name={valueSpan}></InfoTag>
                    }
                }
            } else if (c.dataIndex == 'siftStatus') {
                c.render = (text, record, index) => {
                    let valueSpan = record[c.dataIndex + "span"];
                    if (record[c.dataIndex] == '0') {        //已筛选
                        return <InfoTag ecId={`${this && this.props && this.props.ecId || ''}_InfoTag@tgtysc`} color='#1ad05d' name={valueSpan}></InfoTag>
                    } else if (record[c.dataIndex] == '1') {      //未签收
                        return <InfoTag ecId={`${this && this.props && this.props.ecId || ''}_InfoTag@z0rt93`} color='#ff6128' name={valueSpan}></InfoTag>
                    } else if (record[c.dataIndex] == '2') {      //已签收
                        return <InfoTag ecId={`${this && this.props && this.props.ecId || ''}_InfoTag@et768q`} color='#87d068' name={valueSpan}></InfoTag>
                    } else if (record[c.dataIndex] == '3') {      //驳回
                        return <InfoTag ecId={`${this && this.props && this.props.ecId || ''}_InfoTag@yo8fag`} color='#dd3131' name={valueSpan}></InfoTag>
                    } else if (record[c.dataIndex] == '4') {      //已采用
                        return <InfoTag ecId={`${this && this.props && this.props.ecId || ''}_InfoTag@b2yhf8`} color='#bf8f8f' name={valueSpan}></InfoTag>
                    } else if (record[c.dataIndex] == '5') {      //特殊采用
                        return <InfoTag ecId={`${this && this.props && this.props.ecId || ''}_InfoTag@hxilzr`} color='#4f8bfb' name={valueSpan}></InfoTag>
                    } else if (record[c.dataIndex] == '6') {      //专报采用
                        return <InfoTag ecId={`${this && this.props && this.props.ecId || ''}_InfoTag@l6atzy`} color='#b379f2' name={valueSpan}></InfoTag>
                    } else if (record[c.dataIndex] == '7') {      //已发布
                        return <InfoTag ecId={`${this && this.props && this.props.ecId || ''}_InfoTag@jwrh7d`} color='#45cfe7' name={valueSpan}></InfoTag>
                    } else {            //未筛选
                        return <InfoTag ecId={`${this && this.props && this.props.ecId || ''}_InfoTag@0l0fx5`} color='#f50' name={valueSpan}></InfoTag>
                    }
                }
            } else {
                c.render = function (text, record) {
                    let valueSpan = record[c.dataIndex + "span"] !== undefined ? record[c.dataIndex + "span"] : record[c.dataIndex];
                    return <span dangerouslySetInnerHTML={{ __html: valueSpan }}></span>
                }
            }
        })
        return columns;
    }

    changeTab(key) {
        const {infoReportListStore} = this.props;
        infoReportListStore.changeTab(key);
    }
    render() {
        const { infoReportListStore} = this.props;
        const {loadingSpin, isRight, infoDialogStore, tableStore, title, searchForm, searchCondition, showSearchAd, reLoad, status: {loading}, tabs, selectTabKey} = infoReportListStore;
        const rightMenu = infoReportListStore.getRightMenu();
        const formParams = searchForm.getFormParams() || {};
        if (loadingSpin) {
            return <div className="h100" style={{ textAlign: 'center', paddingTop: '300px' }}><Spin ecId={`${this && this.props && this.props.ecId || ''}_Spin@wgk996`} size="large"/></div>
        }
        if (!isRight) {
            return <WeaAlertPage ecId={`${this && this.props && this.props.ecId || ''}_WeaAlertPage@zst2ia`}><div>{getLabel(382663, '暂无权限') }</div></WeaAlertPage>
        }
        return (
            <div className='wea-govern-info'>
                <WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@4uuprx`}
                    datas={rightMenu}>
                    <div style={{ backgroundColor: '#fff' }}>
                        <WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@lnneqd`}
                            title={title}
                            icon={<i className='icon-coms-government' />}
                            iconBgcolor='#f14a2d'
                            loading={loading}
                            buttons={this.getTopButtons() }
                            showDropIcon={true}
                            dropMenuDatas={rightMenu}
                            >
                            <WeaTab ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@rdinck`}
                                leftStyle={{ width: '80%' }}
                                datas={tabs}
                                keyParam="key"  //主键
                                selectedKey={selectTabKey}
                                advanceHeight={200}
                                onChange={this.changeTab.bind(this) }
                                buttonsAd={getAdButtons(infoReportListStore) }
                                searchType={['base', 'advanced']}
                                searchsBaseValue={formParams.title}
                                setShowSearchAd={bool => { infoReportListStore.setShowSearchAd(bool) } }
                                hideSearchAd={() => infoReportListStore.setShowSearchAd(false) }
                                searchsAd={
                                    <div><Condition ecId={`${this && this.props && this.props.ecId || ''}_Condition@tcyb40`} listStore={infoReportListStore} form={searchForm} condition={searchCondition} onEnterSearch={()=>{infoReportListStore.doSearch();infoReportListStore.setShowSearchAd(false);}} ></Condition></div>
                                }
                                showSearchAd={showSearchAd}
                                onSearch={v => { infoReportListStore.doSearch() } }
                                onSearchChange={v => {
                                    if (infoReportListStore.searchForm.has("title")) {
                                        infoReportListStore.appendFormFields({ title: { value: v } })
                                    } else {
                                        infoReportListStore.searchForm.add(v, { key: "title" })
                                    }
                                } }
                                />
                            <WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@tt8v5v`} comsWeaTableStore={tableStore}
                                register_table={() => reLoad() }
                                getColumns={c => this.reRenderColumns(c) }
                                needScroll={true}
                                className="wea-info-table"
                                />
                            {infoDialogStore.status.visible && <ReportInfoDialog ecId={`${this && this.props && this.props.ecId || ''}_ReportInfoDialog@mhjrgt`} store={infoDialogStore} />}
                        </WeaTop>
                    </div>
                </WeaRightMenu>
            </div>
        )
    }



}

export default InfoReportList;